/*
 *@author: YangJie
 *@date: 2021-04-08 16:00:23
 *@version:
 *@description: 参数设置->公共配置->租用单位
 */
 import React, { Component } from 'react';
 import { Table, Button, Form, Card, Tabs } from 'antd';
 import '@/assets/css/settings';
 import * as Utils from '../../../utils_yyr/action';
 import BasicForm from '../../../components_yyr/common/basicForm';
 import BasicDrawer from '../../../components_yyr/common/basicDrawer';
 import { FileDown, FileUpload } from '../../../components_yyr/commponent/File';
 import Paging from '../../../components_yyr/commponent/Paging';
import BasicConfirm from '../../../components_yyr/common/basicConfirm';
import { euqApplicationName } from '../../../config';
 
 const { TabPane } = Tabs;
 //测试数据
 
 class CurrentUnit extends Component {
	 state = {
		 loading: false, //加载中...
		 dataSource: [], //数据源
		 drawerVisible: false, //新增修改抽屉的显示与隐藏
		 chooseData: {}, //用checkbox选择好的数据
		 drawerTitle: '', //抽屉的标题
		 total: 0, //总数据量
		 formValues: {type:1},
		 selectedData: [],
		 selectedKeys: [],
		 handleType:0
	 };
	 componentDidMount() {
		 this.fetch({
			 pageNum: 1,
			 pageSize: 10,
			 type:2
		 });
		 // this.getInfo();
	 }
	 //初始化加载数据
	 fetch = data => {
		 let str = ''
		 for(var key in data){
			 if(data[key]){
				 str += `&${key}=${data[key]}`
			 }
		 }
		 this.setState({ loading: true })
		 this.get(euqApplicationName + '/parameter_setting_public/queryRentDepartmentByParam?'+str).then(res => {
			 this.setState({
				 loading: false,
				 dataSource: res.data,
				 total:res.total,
				 formValues:data
			 });
		 })
	 };
 
	//表单查询
	filterSubmit = values => {
		values.pageNum = this.state.formValues.pageNum;
		values.pageSize = this.state.formValues.pageSize;
		values.type = 2
		this.fetch(values);
	};
 
	 handleConfirm = (value, api, chooseData) => {
		 console.log(this.state.selectedData)
		 let str = ''
		 for(var item of this.state.selectedData){
			 str += item.id + ','
		 }
		 // let newDataSource = [];
		 // for (let i of this.state.dataSource) {
		 // 	let flag = true;
		 // 	for (let j of chooseData) {
		 // 		if (j.key == i.key) {
		 // 			flag = false;
		 // 			break;
		 // 		}
		 // 	}
		 // 	if (flag) {
		 // 		newDataSource.push(i);
		 // 	}
		 // }
		 // this.setState({
		 // 	dataSource: newDataSource,
		 // 	selectedKeys: [],
		 // 	selectedData: []
		 // });
 
		 // 暂时注销
		 // if (api === 1) {
		 this.get(`${euqApplicationName}/parameter_setting_public/deleteRentDepartment?ids=${str.slice(0, str.length - 1)}`).then(res => {
				 this.success();
				 this.fetch({ ...this.state.formValues });
				 this.setState({selectedKeys:[]})
			 });
		 // }
	 };
 
	 //头部关键字查询部分
	 formList = () => {
		const formList = [
			{ type: 'INPUT', label: '单位名称', field: 'deptName', col: 8 },
			{ type: 'INPUT', label: '单位编码', field: 'deptCode', col: 8 },
			{ type: 'INPUT', label: '联系人', field: 'user', col: 8 },
		];
		return formList;
	};
	 //抽屉中信息列表
	 drawerFormList = data => {
		 //TODO后续看看是否修改type
		 const drawerFormList = [
			 { type: 'INPUT', label: '单位编码', field: 'deptCode', initialValue: data.deptCode  ,placeholder:'如不输入则自动编码'},
			 { type: 'INPUT', label: '单位名称', field: 'name', initialValue: data.name, required: true },
			 { type: 'INPUT', label: '默认联系人', field: 'user', initialValue: data.user },
			 { type: 'INPUT', label: 'QQ', field: 'qqNumber', initialValue: data.qqNumber },
			 { type: 'INPUT', label: ' 微信号', field: 'weChat', initialValue: data.weChat },
			 { type: 'INPUT', label: '电话', field: 'phone', initialValue: data.phone },
			 { type: 'INPUT', label: 'Email', field: 'email', initialValue: data.email },
			 { type: 'INPUT', label: '传真', field: 'fax', initialValue: data.fax },
			 { type: 'INPUT', label: '税务登记号', field: 'taxNumber	', initialValue: data.taxNumber	 },
			 { type: 'INPUT', label: '地址', field: 'address', initialValue: data.address },
			 { type: 'INPUT', label: '邮编', field: 'postCode', initialValue: data.postCode },
			 { type: 'INPUT', label: '开户行', field: 'bank ', initialValue: data.bank },
			 { type: 'INPUT', label: '银行账户', field: 'bankAccount', initialValue: data.bankAccount },
			 { type: 'INPUT', label: '网址', field: 'website', initialValue: data.website },
			 { type: 'TEXTAREA', label: '备注', field: 'remarks', initialValue: data.remarks }
		 ];
		 return drawerFormList;
	 };
 
	 // 提交modal
	 handleSubmit = data => {
		 const { dataSource, chooseData } = this.state;
		 // let key = chooseData.key;
		 // let newDataSource = dataSource;
		 // let index = newDataSource.findIndex(value => value.key == key);
		 // if (key) {
		 // 	console.log('******修改******');
		 // 	for (let j of newDataSource) {
		 // 		if (j.key == key) {
		 // 			newDataSource[index] = { ...newDataSource[index], ...data };
		 // 		}
		 // 	}
		 // } else {
		 // 	console.log('******添加******');
		 // 	data.id = this.state.dataSource.length + 1;
		 // 	data.key = this.state.dataSource.length + 1;
		 // 	newDataSource.push(data);
		 // }
		 // this.setState({
		 // 	dataSource: newDataSource,
		 // 	selectedKeys: [],
		 // 	selectedData: []
		 // });
 
		 // this.onClose();
 
		 // 暂时注释
		 const id = this.state.chooseData && this.state.chooseData.id;
		 if (id && this.state.handleType === 1) {
			 data = Object.assign({}, data, { id: id });
			 data.updateId = localStorage.getItem('userId');
		 } else {
			 data.createId = localStorage.getItem('userId');
		 }
		 data.type = 2
		 this.post(euqApplicationName + '/parameter_setting_public/addRentDepartment', { data }).then(res => {
			 this.success();
			 this.fetch({ ...this.state.formValues });
			 this.onClose();
			 this.setState({selectedKeys:[]})
		 });
	 };
 
	 // 打开modal，判断是修改还是新增 0新增 1修改
	 handleModal = (type, data) => {
		 const { selectedData } = this.state;
		 if (type) {
			 if (selectedData.length == 1) {
				 this.setState({
					 drawerTitle: '修改',
					 drawerVisible: true,
					 chooseData: selectedData[0],
					 handleType:type
				 });
			 } else {
				 Utils.openNotification('warning', '请只选择一条修改');
			 }
		 } else {
			 this.setState({
				 drawerTitle: '添加',
				 drawerVisible: true,
				 handleType:type
			 });
		 }
	 };
 
	 onClose = () => {
		 this.setState({
			 drawerVisible: false,
			 chooseData: {}
		 });
		 this.modalRef.props.form.resetFields();
	 };
	 render() {
		 const columns = [
			//  {
			// 	 title: '序号',
			// 	 width: 100,
			// 	//  dataIndex: 'id',
			// 	 //到时用分页来实现序号
			// 	 render: (index) => {
			// 	 	return `${(index + 1)}`;
			// 	 }
			//  },
			 {
				 title: '单位编码',
				 width: 150,
				 dataIndex: 'deptCode'
			 },
			 {
				 title: '单位名称',
				 width: 200,
				 dataIndex: 'name'
			 },
			 {
				 title: '默认联系人',
				 width: 150,
				 dataIndex: 'user'
			 },
			 {
				 title: 'QQ',
				 width: 150,
				 dataIndex: 'qqNumber'
			 },
			 {
				 title: '微信号',
				 width: 150,
				 dataIndex: 'weChat'
			 },
			 {
				 title: '联系电话',
				 width: 150,
				 dataIndex: 'phone'
			 },
			 {
				 title: '传真',
				 width: 150,
				 dataIndex: 'fax'
			 },
			 {
				 title: '地址',
				 width: 200,
				 dataIndex: 'address'
			 },
			 {
				 title: '邮编',
				 width: 150,
				 dataIndex: 'postCode'
			 },
			 {
				 title: 'Email',
				 width: 150,
				 dataIndex: 'email'
			 },
			 {
				 title: '备注',
				 width: 200,
				 dataIndex: 'remarks'
			 }
		 ];
 
		 const { chooseData, drawerVisible, drawerTitle, dataSource, loading, total, formValues, selectedKeys, selectedData } = this.state;
 
		 const drawerProps = {
			 onRef: ref => (this.modalRef = ref),
			 visible: drawerVisible,
			 width: 700,
			 drawerFormList: this.drawerFormList(chooseData),
			 submit: this.handleSubmit,
			 onClose: this.onClose,
			 title: drawerTitle
		 };
 
		 //checkbox部分
		 const rowSelection = {
			 selectedRowKeys: selectedKeys,
			 onChange: (selectedRowKeys, selectedRows) => {
				 this.setState({
					 selectedData: selectedRows,
					 selectedKeys: selectedRowKeys
				 });
			 },
			 getCheckboxProps: record => ({
				 disabled: record.name === 'Disabled User',
				 name: record.name
			 })
		 };
		 
		 return (
			 <div className="shadow-radius">
				 <Card>
					 <BasicForm formList={this.formList()} filterSubmit={this.filterSubmit} labelSpan={8} wrapperSpan={12} onRef={ref => (this.child = ref)} />
				 </Card>
 
				 <Tabs
					 tabBarExtraContent={
						 <div className="buttonList">
							 <Button icon="plus" onClick={() => this.handleModal(0, {})} type="primary">
								 {' '}
								 添加
							 </Button>
							 {/* 修改数据 新增和修改中的数据都比显示的数据多几项 */}
							 <Button icon="eye" onClick={() => this.handleModal(1, {})} type="primary">
								 修改
							 </Button>
							 <BasicConfirm title="确认删除?" api={1} icon="delete" button={true} buttonName="删除" data={selectedData} handleConfirm={this.handleConfirm} />
							 <FileDown fileName="租用单位清单" buttonName="导出" method="post" apiPath={euqApplicationName + "/parameter_setting_public/exportRentDepartmentListExcel"} data={{ids:selectedKeys,type:2}} />
							 <FileUpload buttonName="导入" apiPath={euqApplicationName + "/parameter_setting_public/importRentDepartmentListExcel"} load={true} fetch={() => this.fetch({ ...formValues })} parameter={{type:2}}/>
						 </div>
					 }
				 >
					 <TabPane tab="租用单位" key="1">
						 <Table columns={columns} rowSelection={rowSelection} rowKey={(record) => record.id} dataSource={dataSource} pagination={false} loading={loading} scroll={{ y: 350, x: 1300 }} />
						 <Paging total={total} formValues={formValues} fetch={pager => this.fetch(pager)} />
					 </TabPane>
				 </Tabs>
 
				 <BasicDrawer {...drawerProps} />
			 </div>
		 );
	 }
 }
 export default Form.create()(CurrentUnit);
 